html,body{
    color: #000000;
    text-align: left;
    margin: 0%;
    margin-left: 0%;
    margin-right: 0%;
    padding: 0 0 0 0;
    font-family: 'Sans ser-if';
    height: 100%;
    display: grid;
}


.table-container {
  width: 100%;
  height: 100%;
  overflow: auto;
}

/* .container {
  background: rgb(235, 235, 235) 100% 100%;
} */
 
.header-title {
  font-size: 24px;
  color: #000000;
  margin-block-start: 1em;
  text-align: center;
  width: 100%;
}

.month-select-dropdown {
  width: 200px;
}

.container-frame {
  border-radius: 1px;
  border-width: 1px;
  border-color: #000000;
  border-style: solid;
  box-shadow: 2px 2px 5px #dbdbdb;
  text-align: left;
  border-color: lightgrey;
  margin-left: 5px;
  background-color: white;
}
.container-frame l {
  width: 20%;
  float: left;
}

.part-title {
  font-size: 18px;
  color: #000000;
  margin-block-start: 1.5em;
  font-weight: bold;
  margin-bottom: 10px;
}

.note-style {
  font-size: 11px;
  color: grey;
}

.simple-note-title {
  font-size: 16px;
  font-weight: bold;
}

.simple-note-content {
  font-size: 14px;
  padding: 0;
}


.part-subtitle {
  font-size: 16px;
  color: black;
  margin-block-start: 0.5em;
  text-align: left;
  font-weight: bold;
  margin-bottom: 10px;
}


table {
  border: 2px solid rgb(140 140 140);
  font-size: 0.8rem;
  letter-spacing: 1px;
  border-collapse: collapse;
}
thead,
tfoot {
background-color: rgb(228 240 245);
}

th,
td {
border: 1px solid rgb(160 160 160);
padding: 8px 10px;
}

td:last-of-type {
text-align: center;
}

tbody > tr:nth-of-type(even) {
background-color: rgb(237 238 242);
}

tfoot th {
text-align: right;
}

tfoot td {
font-weight: bold;
}
